<template>
  <div class="turnOverList">
    <x-header class="header" :left-options="{showBack: showHeaderBack}" ref="header">
      翻台列表
      <a v-if="loadingStatus" slot="right" >刷新中...</a>
      <a v-else slot="right" @click="refreshPage(true)" >刷新页面</a>
    </x-header>
    <div class="topHolder"></div>
    <group title="详情列表：">
      <x-table :cell-bordered="false">
        <thead>
        <tr style="background-color: #F7F7F7">
          <th width="55%">台位名称</th>
          <th width="45%">翻台次数</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(item,index) in turnList" :key="index">
          <td v-text="item.AREA + ' - ' + item.NUMBER + '（' + item.ROOM_PLATFORM_TYPE + '）'"></td>
          <td v-text="item.turnNum"></td>
        </tr>
        <tr v-if="turnList.length <= 0">
          <td colspan="3">
            <div class="listNoItem">暂无翻台数据</div>
          </td>
        </tr>
        </tbody>
      </x-table>
    </group>
    <br/>
  </div>
</template>

<script>
  import {getTurnOverList} from "../../api";
  import {Box, XButton, Group, XTable } from 'vux'
  import {message} from "../../common/util";

  export default {
    name:'turnOverList',
    data(){
      return{
        showHeaderBack:this.GLOBAL.showHeaderBack,
        loadingStatus:false,
        turnList:[]
      }
    },
    components:{
      Box,
      XButton,
      Group,
      XTable
    },
    computed:{
      authority(){
        return this.$store.getters.getAuthority
      }
    },
    methods:{
      refreshPage(mess){
        this.loadingStatus = true
        getTurnOverList().then((res)=>{
          if(res.status == 'success'){
            this.turnList = res.data
            if(mess)message({message:'刷新页面成功',type:'info'})
          }else if(res.status == 'error') {
            message({message:res.msg,type:'error'})
            console.log('getTurnOverList error info:', res.msg)
          }
          this.loadingStatus = false
        }).catch((err)=>{console.log('getTurnOverList catch info:',err)})
        this.$store.commit('updateLoadingStatus',{isLoading:false})
        //this.$router.go(0)
      }
    },
    mounted(){
      this.refreshPage()
    }
  }
</script>

<style lang="scss" scoped>
  .turnOverList{
  }
</style>
